<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>01_作用域</title>
</head>
<body>
<!--
1. 理解
  * 就是一块"地盘", 一个代码段所在的区域
  * 它是静态的(相对于上下文对象), 在编写代码时就确定了
2. 分类
  * 全局作用域
  * 函数作用域
  * 没有块作用域(ES6有了)
3. 作用
  * 隔离变量，不同作用域下同名变量不会有冲突
-->
<script type="text/javascript">
    /*  //没块作用域
      if(true) {
        var c = 3
      }
      console.log(c)*/
    const a = 10,
        b = 20;

    function fn(x) {
        const a = 100,
            c = 300;
        console.log('fn()', a, b, c, x)

        function bar(x) {
            const a = 1000,
                d = 400;
            console.log('bar()', a, b, c, d, x)
        }

        bar(100)
        bar(200)
    }

    fn(10)
</script>
</body>
</html>